<template>
  <div class="huadi-aside">
    <div class="timer">

    </div>
    <el-row>
      <el-col :span="24">
        <el-menu
          default-active="/EntrySchoolForm"
          class="el-menu-vertical-demo"
          @open="handleOpen"
          @close="handleClose"
          background-color="#fff"
          text-color="#2196f3"
          router
          active-text-color="#2196f3!important">
          <el-submenu index="/EntrySchoolForm">
            <template slot="title">
              <i class="el-icon-edit-outline icon"></i>
              <span>日常工作</span>
            </template>
            <el-menu-item-group>
            <el-menu-item   index="/EntrySchoolForm">原材料隔离跟踪</el-menu-item>
            <el-menu-item   index="/OpenDayActivityForm">隔离条件</el-menu-item>
            <el-menu-item   index="/OpenDayEntryForm">物料记录</el-menu-item>
            <!-- <el-menu-item   index="/OpenDayEntryEdit">隔离条件</el-menu-item>-->
            </el-menu-item-group>
          </el-submenu>
        <el-submenu index="/UserEdit">
          <template slot="title">
            <i class="el-icon-menu icon"></i>
            <span>基础信息</span>
          </template>
          <el-menu-item   index="/UserForm">用户管理</el-menu-item>
        </el-submenu>
        </el-menu>
      </el-col>
    </el-row>
  </div>
</template>
<script>
  export default {
    name: 'Aside',
    data () {
      return {
      }
    },
    methods:{
      handleOpen(key, keyPath) {
        console.log(key, keyPath);
      },
      handleClose(key, keyPath) {
        console.log(key, keyPath);
      }
    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .icon{
    color:#2196f3;
  }
</style>
